import React from 'react'
import { connect } from 'react-redux'
import { addTodo } from '../actions/actions'

function AddTodo({dispatch}) {
  return (
    <form
      onSubmit={(e) => {
        e.preventDefault()
        const text = e.target.text.value.trim()
        dispatch(addTodo(text))
        e.target.text.value = ''
        e.target.text.focus()
      }}
    >
      <input type="text" name="text" autoComplete="off" />
      <button>+待办事项</button>
    </form>
  )
}
// eslint-disable-next-line no-func-assign
AddTodo = connect()(AddTodo)
export {AddTodo}
